<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>主界面</title>
    <link href="../easyui/themes/default/easyui.css" rel="stylesheet" />
    <link href="../easyui/themes/icon.css" rel="stylesheet" />
    <script src="../easyui/jquery.min.js"></script>
    <script src="../easyui/jquery.easyui.min.js"></script>
    <script src="../easyui/locale/easyui-lang-zh_CN.js"></script>
</head>
<!-- layout（布局） -->
<body class="easyui-layout">
<div data-options="region:'north',title:'网上书城',split:true" style="height:100px;"></div>
<div data-options="region:'south',title:'South Title',split:true" style="height:100px;"></div>
<div data-options="region:'west',title:'菜单管理',split:true" style="width:100px;">
    <div id="aa" class="easyui-accordion" style="width:300px;height:200px;">
        <!-- accordion（分类）    -->
        <div title="Title1" data-options="iconCls:'icon-reload'" style="overflow:auto;padding:10px;">
            <h3 style="color:#0099FF;">Accordion for jQuery</h3>
            <p>Accordion is a part of easyui framework for jQuery.
                It lets you define your accordion component on web page more easily.</p>
        </div>
        <div title="Title2" data-options="iconCls:'icon-reload'" style="padding:10px;">
            <h3 style="color:#0099FF;">Accordion for jQuery</h3>
            <p>Accordion is a part of easyui framework for jQuery.
                It lets you define your accordion component on web page more easily.</p>
        </div>
        <div title="Title3" data-options="iconCls:'icon-reload'" style="padding:10px;">
            <h3 style="color:#0099FF;">Accordion for jQuery</h3>
            <p>Accordion is a part of easyui framework for jQuery.
                It lets you define your accordion component on web page more easily.</p>
        </div>
    </div>
</div>
<div data-options="region:'center',title:'内容区域'" style="padding:5px;background:#eee;">
    <!-- tabs（选项卡） -->
    <div id="tt" class="easyui-tabs" style="width:100%;height:100%;">
        <div title="Tab1" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;display:none;">
            tab1
        </div>
        <div title="Tab2" data-options="iconCls:'icon-reload',closable:true" style="overflow:auto;padding:20px;display:none;">
            tab2
        </div>
        <div title="Tab3" data-options="iconCls:'icon-reload',closable:true" style="padding:20px;display:none;">
            tab3
        </div>
    </div>
</div>
</body>
</html>